var baseURL = "../../";
var vm = new Vue({
    el: '#rrapp',
    data: {
        dateTime: '',
        date:'',
        lendAndReturn:[],
        houseList:[],
        house:'',
        warnList:[],
        isSelect:"1",
        toDoList:[],
        toDo:{},
        isShowTodo:false,
        humidityChart:{},  //湿度图表
        humidityValue:[],  //湿度值(要带单位)，共24个，与时间对应
        humidityTime:[],  //湿度时间(月-日 小时:分钟)，共24个，分别对应24小时
        humidityUnit:'',  //湿度单位
        temperatureChart:{},  //温度图表
        temperatureValue:[],  //温度值
        temperatureTime:[],  //温度时间
        temperatureUnit:''  //温度单位
    },
    created: function() {
        this.getHouseList();
        this.getWarnList();
    },
    mounted:function(){
      localStorage.setItem('sysManageId', 1);
      this.humidityChart = echarts.init(document.getElementById('aleftboxtbott'));
      this.temperatureChart = echarts.init(document.getElementById('aleftboxtmidd'));
      this.date=new Date().getFullYear()+"年"+(new Date().getMonth()+1)+"月"+new Date().getMonth()+"日";
      //this.initEchart();
      this.initLendAndReturn();
      this.initTemperature();
      this.initHumidity();
      this.initPM();
    },
    methods: {
        initEchart:function () {
            var myChart = echarts.init(document.getElementById('amiddboxtbott2'));
            option = {
                backgroundColor: 'rgba(1,202,217,.2)',
                grid: {
                    left:60,
                    right:60,
                    top:50,
                    bottom:40
                },
                legend: {
                    top:10,
                    textStyle:{
                        fontSize: 10,
                        color:'rgba(255,255,255,.7)'
                    },
                    data:['2017年','2018年','同比增速']
                },
                xAxis: [
                    {
                        type: 'category',
                        axisLine:{
                            lineStyle:{
                                color:'rgba(255,255,255,.2)'
                            }
                        },
                        splitLine:{
                            lineStyle:{
                                color:'rgba(255,255,255,.1)'
                            }
                        },
                        axisLabel:{
                            color:"rgba(255,255,255,.7)"
                        },

                        data: ['1','2','3','4','5','6','7','8','9','10','11','12'],
                        axisPointer: {
                            type: 'shadow'
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                        name: '',
                        min: 0,
                        max: 250,
                        interval: 50,
                        axisLine:{
                            lineStyle:{
                                color:'rgba(255,255,255,.3)'
                            }
                        },
                        splitLine:{
                            lineStyle:{
                                color:'rgba(255,255,255,.01)'
                            }
                        },

                        axisLabel: {
                            formatter: '{value} ml'
                        }
                    },
                    {
                        type: 'value',
                        name: '',
                        max: 25,
                        interval: 5,
                        axisLine:{
                            lineStyle:{
                                color:'rgba(255,255,255,.3)'
                            }
                        },
                        splitLine:{
                            lineStyle:{
                                color:'rgba(255,255,255,.1)'
                            }
                        },
                        axisLabel: {
                            formatter: '{value} °C'
                        }
                    }
                ],
                series: [

                    {
                        name:'2017年',
                        type:'bar',
                        itemStyle: {
                            normal: {
                                color: new echarts.graphic.LinearGradient(
                                    0, 0, 0, 1,
                                    [
                                        {offset: 0, color: '#b266ff'},
                                        {offset: 1, color: '#121b87'}
                                    ]
                                )
                            }
                        },
                        data:[2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
                    },
                    {
                        name:'2018年',
                        type:'bar',
                        itemStyle: {
                            normal: {
                                color: new echarts.graphic.LinearGradient(
                                    0, 0, 0, 1,
                                    [
                                        {offset: 0, color: '#00f0ff'},
                                        {offset: 1, color: '#032a72'}
                                    ]
                                )
                            }
                        },
                        data:[2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
                    },
                    {
                        name:'同比增速',
                        type:'line',
                        itemStyle: {
                            normal: {
                                color: new echarts.graphic.LinearGradient(
                                    0, 0, 0, 1,
                                    [
                                        {offset: 0, color: '#fffb34'},
                                        {offset: 1, color: '#fffb34'}
                                    ]
                                )
                            }
                        },
                        yAxisIndex: 1,
                        data:[2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
                    }
                ]
            };
            myChart.setOption(option);

            var myChart = echarts.init(document.getElementById('arightboxbott'));
            option = {
                color:['#7de494','#7fd7b1', '#5578cf', '#5ebbeb', '#d16ad8','#f8e19a',  '#00b7ee', '#81dabe','#5fc5ce'],
                backgroundColor: 'rgba(1,202,217,.2)',

                grid: {
                    left: '5%',
                    right: '8%',
                    bottom: '7%',
                    top:'8%',
                    containLabel: true
                },
                xAxis: {
                    type: 'category',
                    boundaryGap: false,
                    axisLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,.2)'
                        }
                    },
                    splitLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,.1)'
                        }
                    },
                    axisLabel:{
                        color:"rgba(255,255,255,.7)"
                    },
                    data: ['6-08','6-09','6-10','6-11','6-12','6-13','6-14']
                },
                yAxis: {
                    type: 'value',
                    axisLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,.2)'
                        }
                    },
                    splitLine:{
                        lineStyle:{
                            color:'rgba(255,255,255,.1)'
                        }
                    },
                    axisLabel:{
                        color:"rgba(255,255,255,.7)"
                    },
                },
                series: [
                    {
                        name:'2014年',
                        type:'line',
                        stack: '总量',
                        itemStyle : {
                            normal : {
                                lineStyle:{
                                    color:'#00FF00'
                                }
                            }
                        },
                        data:[120, 132, 101, 134, 90, 230, 210]
                    }

                ]
            };
            myChart.setOption(option);
        },
        //初始化出入库
        initLendAndReturn:function () {
            $.ajax({
                type: "GET",
                url: baseURL + "/analysis/lendAndReturn?warehouseId="+localStorage.getItem("house"),
                contentType: "application/json",
                success: function(r){
                    if(r.code === 0){
                        vm.lendAndReturn=r.list;
                        vm.dateTime=(new Date().getFullYear())+'年'+(new Date().getMonth()+1)+"月"
                    }else{
                        alert(r.msg);
                    }
                }
            });
        },
        //初始化温度
        initTemperature:function () {
            $.ajax({
                type: "GET",
                url: baseURL + "statistics/bstatisticstemperature/getAvgByWarehouse?warehouseId="+localStorage.getItem("house"),
                contentType: "application/json",
                success: function(r){
                    if(r.code === 0){
                        vm.temperatureTime = r.bStatisMap.bStatisTime;
                        vm.temperatureValue = r.bStatisMap.bStatisValue
                        vm.temperatureUnit = r.bStatisMap.unit;
                       var  option = {
                           color:['#7de494','#7fd7b1', '#5578cf', '#5ebbeb', '#d16ad8','#f8e19a',  '#00b7ee', '#81dabe','#5fc5ce'],
                           backgroundColor: 'rgba(1,202,217,.2)',
                           grid: {
                               left: '5%',
                               right: '8%',
                               bottom: '7%',
                               top:'8%',
                               containLabel: true
                           },
                           tooltip: {
                               trigger: 'axis',
                               formatter:function(params, ticket, callback) {
                                   console.log(params[0])
                                   var date=new Date(params[0].name);
                                   return  date.getMonth()+1+'月'+ date.getDate()+'日'+ date.getHours()+'时'+ "<br />" +
                                       params[0].value+'℃';
                               }
                           },
                           xAxis: {
                               name:'时间',
                               nameLocation:'start',
                               type: 'category',
                               boundaryGap: false,
                               data:vm.temperatureTime,
                               axisLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.2)'
                                   }
                               },
                               splitLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.1)'
                                   }
                               },
                               axisLabel:{
                                   color:"rgba(255,255,255,.7)",
                                   formatter: function (value, idx) {
                                       var date = new Date(parseInt(value));
                                       return date.getHours();
                                   }
                               },
                           },
                           yAxis: {
                               name:'温度',
                               type: 'value',
                               min: 0,
                               max: 50,
                               interval: 10,
                               axisLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.2)'
                                   }
                               },
                               splitLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.1)'
                                   }
                               },
                               axisLabel:{
                                   color:"rgba(255,255,255,.7)"
                               },
                           },
                           series: [
                               {
                                   name:'温度',
                                   type:'line',
                                   areaStyle: {normal: {}},
                                   data:vm.temperatureValue
                               }

                           ]
                       };
                        vm.temperatureChart.setOption(option);
                    }else{
                        alert(r.msg);
                    }
                }
            });
        },
        //初始化湿度
        initHumidity:function () {
            console.log("vm.chartHumidity", this.humidityChart)
            $.ajax({
                type: "GET",
                url: baseURL + "/statistics/bstatisticshumidity/getAvgByWarehouse?warehouseId="+localStorage.getItem('house'),  //获取指定库房1小时内的数据平均值
                contentType: "application/json",
                success: function(r){
                    if(r.code === 0){
                        vm.humidityTime = r.bStatisMap.bStatisTime;
                        vm.humidityValue = r.bStatisMap.bStatisValue;
                        vm.humidityUnit = r.bStatisMap.unit;
                       var option = {
                           tooltip: {
                               trigger: 'axis',
                               formatter:function(params, ticket, callback) {
                                   console.log('axisparams', params);
                                   var param = params[0];
                                   return param.value+vm.humidityUnit;
                               }
                           },
                           grid: {
                               left: '3%',
                               right: '4%',
                               bottom: '3%',
                               containLabel: true
                           },
                           xAxis: {
                               name:'时间',
                               nameLocation:'start',
                               type: 'category',
                               boundaryGap: false,
                               data:vm.humidityTime,
                               axisLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.2)'
                                   }
                               },
                               splitLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.1)'
                                   }
                               },
                               axisLabel:{
                                   color:"rgba(255,255,255,.7)",
                                   interval:0,
                                   formatter: function (value, idx) {
                                       var time1 = new Date(parseInt(value, 10));  //不parseInt 的话，会出现NaN
                                       return time1.Format("HH");
                                   }
                               },
                           },
                           yAxis: {
                               name:'湿度%',
                               type: 'value',
                               min: 0,
                               max: 70,
                               interval: 10,
                               axisLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.2)'
                                   }
                               },
                               splitLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.1)'
                                   }
                               },
                               axisLabel:{
                                   color:"rgba(255,255,255,.7)",
                                   formatter: function (value, idx) {
                                       return value;
                                   }
                               },
                           },
                           series: [
                               {
                                   name:'湿度',
                                   type:'line',
                                   smooth: true,
                                   data:vm.humidityValue
                               }
                           ]
                       };
                       console.log("vm.humidityChart response",vm.humidityChart);
                        vm.humidityChart.setOption(option);
                    }else{
                        alert(r.msg);
                    }
                }
            });
        },
        //初始化pm2.5
        initPM:function () {
            $.ajax({
                type: "GET",
                url: baseURL + "/analysis/queryReport/3",
                contentType: "application/json",
                success: function(r){
                    if(r.code === 0){
                        var year=new Date().getFullYear();
                        var myChart = echarts.init(document.getElementById('amiddboxtbott1'));
                       var option = {

                           tooltip: {
                               trigger: 'axis',
                               formatter:function(params, ticket, callback) {
                                   console.log(params[0])
                                   var date=new Date(params[0].name);
                                   return  date.getMonth()+1+'月'+ date.getDate()+'日'+ "<br />" +
                                       params[0].value+'ug/M3'+ "<br />" +
                                      '国家标准：75ug/M3';
                               }
                           },
                           grid: {
                               left: '3%',
                               right: '4%',
                               bottom: '3%',
                               containLabel: true
                           },
                           xAxis: {
                               type: 'category',
                               boundaryGap: false,
                               data:r.list[0],
                               axisLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.2)'
                                   }
                               },
                               splitLine:{
                                   lineStyle:{
                                       color:'rgba(255,255,255,.1)'
                                   }
                               },
                               axisLabel:{
                                   color:"rgba(255,255,255,.7)",
                                   formatter: function (value, idx) {
                                       var date = new Date(value);
                                       return date.getDate();
                                   }
                               },
                           },
                           yAxis:[{
                                   type: 'value',
                                   axisLine: {
                                       lineStyle: {
                                           color: 'rgba(255,255,255,.2)'
                                       }
                                   },
                                   splitLine: {
                                       lineStyle: {
                                           color: 'rgba(255,255,255,.1)'
                                       }
                                   },
                                   axisLabel: {
                                       color: "rgba(255,255,255,.7)"
                                   }
                                },
                               {
                                   type: 'value',
                                   name: '',
                                   max: 25,
                                   interval: 5,
                                   axisLine:{
                                       lineStyle:{
                                           color:'rgba(255,255,255,.3)'
                                       }
                                   },
                                   splitLine:{
                                       lineStyle:{
                                           color:'rgba(255,255,255,.1)'
                                       }
                                   },
                                   axisLabel: {
                                       formatter: '{value} °C'
                                   }
                               }
                           ],
                           series: [
                               {
                                   name:'pm2.5',
                                   type:'line',
                                   smooth: true,
                                   stack: '2',
                                   data:r.list[1]
                               },
                               {
                                   name:'国家标准',
                                   type:'line',
                                   smooth: true,
                                   stack: '1',
                                   data:[75,75,100,75,20,75],
                                   itemStyle : {
                                       normal : {
                                           lineStyle:{
                                               color:'#00FF00'
                                           }
                                       }
                                   },

                               }

                           ]
                       };
                        myChart.setOption(option);
                    }else{
                        alert(r.msg);
                    }
                }
            });
        },
        showMenuPage:function () {
            //sysManageId如果没有值，就设成1
            if(!localStorage.getItem('sysManageId'))
                localStorage.setItem('sysManageId', 1);
            //跳转页面
            location.href='/index.html';
        },
        switchTab: function(sysManageId) {
            //存储sysManageId
            localStorage.setItem('sysManageId', sysManageId);
            //跳转页面
            if (sysManageId === 1) {
                location.href = '/analysis.html';
            } else if (sysManageId === 2) {
                location.href = '/people.html';
            } else if (sysManageId === 3) {
                location.href = '/observatory.html';
            }
        },
        getHouseList:function(){
            $.getJSON("basics/bwarehouse/listAll?_"+$.now(), function(r){
                vm.houseList = r.list;
                var house= localStorage.getItem('house');
                if(house){
                    vm.house=parseInt(house);
                }else{
                    vm.house=r.list[0].id;
                    localStorage.setItem('house',vm.house);
                    location.reload();
                }
                //加载待办已办
                vm.initToDo();
            });
        },
        houseChange:function(event){
            console.log("houseChange:::", event);
            localStorage.setItem('house',event);
            location.reload();
        },
        getWarnList: function() {
            $.ajax({
                type: "GET",
                url: baseURL +  'warn/brfidwarn/list?page=1&limit=5', //查太多，盛不下
                success: function(r){
                    if(r.code === 0){
                        vm.warnList = r.rfidWarnList.list;
                    }
                }
            });
        },
        //待办已办切换
        toDoChange:function(event){
            this.initToDo();
        },
        //初始化代办已办
        initToDo:function () {
            var  that=this;
            $.ajax({
                type: "GET",
                url: baseURL + "/analysis/initToDo/"+that.isSelect+"/"+localStorage.getItem("house"),
                contentType: "application/json",
                success: function(r){
                    if(r.code === 0){
                        vm.toDoList=r.list;
                        /*if(that.isSelect =="0" && r.list.length==0){
                            that.isSelect="1"
                            that.initToDo();
                        }*/
                        //vm.dateTime=(new Date().getFullYear())+'年'+(new Date().getMonth()+1)+"月"
                    }else{
                        alert(r.msg);
                    }
                }
            });
        },
        clickToDO:function(toDo){
            this.toDo=toDo;
            this.isShowTodo=true;
        },
        ok :function() {

        },
        cancel :function() {

        },
        updateStatis: function() {
            var wareHouseId = localStorage.getItem('house');
            //更新湿度
            $.ajax({
                type: "GET",
                url: baseURL + "/statistics/bstatisticshumidity/getAvgByWarehouse?warehouseId=" + wareHouseId,  //获取指定库房1小时内的数据平均值
                contentType: "application/json",
                success: function (r) {
                    if (r.code === 0) {
                        vm.humidityTime = r.bStatisMap.bStatisTime;
                        vm.humidityValue = r.bStatisMap.bStatisValue;
                        vm.humidityUnit = r.bStatisMap.unit;

                        //更新图表值
                        vm.humidityChart.setOption({
                            xAxis:{
                                data:vm.humidityTime
                            },
                            series: [{
                                data:vm.humidityValue
                            }]
                        });
                    } else {
                        alert(r.msg);
                    }
                }
            });
            //更新温度
            $.ajax({
                type: "GET",
                url: baseURL + "/statistics/bstatisticstemperature/getAvgByWarehouse?warehouseId=" + wareHouseId,  //获取指定库房1小时内的数据平均值
                contentType: "application/json",
                success: function (r) {
                    if (r.code === 0) {
                        vm.temperatureTime = r.bStatisMap.bStatisTime;
                        vm.temperatureValue = r.bStatisMap.bStatisValue;
                        vm.temperatureUnit = r.bStatisMap.unit;

                        //更新图表值
                        vm.humidityChart.setOption({
                            xAxis:{
                                data:vm.temperatureTime
                            },
                            series: [{
                                data:vm.temperatureValue
                            }]
                        });
                    } else {
                        alert(r.msg);
                    }
                }
            });
        }
    }
});

setInterval(vm.updateStatis, 1000*60*60);  //1小时刷新一次

// 时间格式化.
Date.prototype.Format = function (fmt) { //author: meizz
    var o = {
        "M+": this.getMonth() + 1, //月份
        "d+": this.getDate(), //日
        "H+": this.getHours(), //小时
        "m+": this.getMinutes(), //分
        "s+": this.getSeconds(), //秒
        "q+": Math.floor((this.getMonth() + 3) / 3), //季度
        "S": this.getMilliseconds() //毫秒
    };
    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var k in o)
        if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
    return fmt;
}
